W-21432256: Salesforce Payments on PWA Feature by rasbhat · Pull Request #3722 · SalesforceCommerceCloud/pwa-kit

rasbhat · 2026-03-05T02:19:45Z

This PR is in continuation of #3709, has been raised to resolve cla:missing label.

This PR spans 3 packages with ~15,165 lines added across 120 files (including tests and translations). The changes enable Stripe, Adyen, and PayPal payment processing via the SF Payments SDK, with both standard checkout and express payment flows (Apple Pay, Google Pay, PayPal, Venmo).

Gus item: https://gus.lightning.force.com/lightning/r/ADM_Work__c/a07EE00002VgsrOYAR/view

Description

This document summarizes the Salesforce Payments on PWA Feature:
https://salesforce.quip.com/UErWA4QiaiES

Areas that are common and can be reviewed further include

changes to package,json
changes to default.js files (template and handle-bars)
changes to ssr.js
commerce sdk react
Any v1-V2 changes that might be applicable outside of Payments
Shared Components/files:
- ProductView
- Routes.jsx
- Constants.js
- Cartmodal
- Addressfield
- Usecurrentbasket hook
- Usecurrentcustomer hook
- Checkout index
- CheckoutContext

Areas that are Domain/Payments specific

There are many components,hooks,changes to pages done as part of Salesforce Payments. Hopefully the attached doc will help but its pretty involved to understand the business logic

Types of Changes

Bug fix (non-breaking change that fixes an issue)
New feature (non-breaking change that adds functionality)
Documentation update
Breaking change (could cause existing functionality to not work as expected)
Other changes (non-breaking changes that does not fit any of the above)

Breaking changes include:

Removing a public function or component or prop

Adding a required argument to a function

Changing the data type of a function parameter or return value

Adding a new peer dependency to package.json

Changes

(change1)

How to Test-Drive This PR

(step1)

Checklists

General

Changes are covered by test cases
CHANGELOG.md updated with a short description of changes (not required for documentation updates)

Accessibility Compliance

You must check off all items in one of the follow two lists:

There are no changes to UI

or...

Changes were tested with a Screen Reader (iOS VoiceOver or Android Talkback) and had no issues
Changes comply with WCAG 2.0 guidelines levels A and AA
Changes to common UI patterns and interactions comply with WAI-ARIA best practices

Localization

Changes include a UI text update in the Retail React App (which requires translation)

* PWA on SFP spike * sfp on pwa part 1 * use new payment instrument request * conditionally render express box * add ShopperPayments tests * lint and tests * address comments * clean up --------- Co-authored-by: Jeff Raab <jraab@salesforce.com>

* render paypal * refactor shopper config checker

* refactor shopper config checker * baskets v2 temp commit * complete paypal and code clean up * address comments * fix

* @W-19685609 Express on PDP with Temporary Basket * Address Code Review: Fix comments, remove eagerly created validations, move temp basket to its a hook, i10n for errors, etc * Address Code Review: Fix additional comments, i10 labels, set keepPreviousData to false by default in current basket hook * Address Code Review: do not set keepPreviousData flag to true in useCurrentBasket hook until further testing confirms that it is needed * Address updates to SDK event changes in payment sheet * Remove the optional keepPreviousData property setting in usecurrentbasket hook * Undo i10 call for an error that nees to be looged into console only * Reset maximumButtonCount to 1 * Remove commented line * Replace undefined with empty function for onclick action in payment sheet

…/sfp-update-amount-prevent-reinit @W-20117176 : Call updateAmount on Order Total change

… SFP

* W-19443266: Handle Failure use-cases by calling Fail Order where necessary. Also refactor the client-secret retrieval since the response structure has changed.

…/order-confirmation-hide-sfp-payment-details @W-19799923: Remove payment details on order confirmation page for SFP orders

…users

…g tests

…/fail-order-on-redirect W-21372336: Fail Order for redirect based payments

…/stripe-caching-for-display-spm-fix-tests W-21411273, W-21434212: Fix for Display SPMs at checkout due to caching issues and Fix for failing tests on feature branch

…/merge-changes-from-develop W-21436534: Merge from Develop to feature branch

* W-21432256: address code review comments from PWA team

…/payment-sheet-zone-id W-21324157: Zone ID updated to use paymentconfig zoneID in Payment Sheet

…-20911530-UT W-20911530: fixing failing unit test

cc-prodsec · 2026-03-05T02:19:56Z

✅ Snyk checks have passed. No issues have been found so far.

Status	Scanner	Critical	High	Medium	Low	Total (0)
✅	Open Source Security	0	0	0	0	0 issues
✅	Licenses	0	0	0	0	0 issues

💻 Catch issues earlier using the plugins for VS Code, JetBrains IDEs, Visual Studio, and Eclipse.

Made-with: Cursor

syadupathi-sf · 2026-03-05T14:43:16Z

Changes in the One click checkout files look good to me.Approved.

vcua-mobify · 2026-03-05T17:46:19Z

packages/pwa-kit-create-app/assets/bootstrap/js/config/default.js.hbs

+        // Set enabled to true to enable Salesforce Payments (requires the Salesforce Payments feature toggle to be enabled on the Commerce Cloud instance).
+        // Set enabled to false to disable Salesforce Payments on the storefront (the Commerce Cloud feature toggle is unaffected).
+        // sdkUrl and metadataUrl are hosted on your Commerce Cloud instance. Replace <hostname> with your instance hostname.
+        // This may be a demandware.net hostname (e.g., myinstance.unified.demandware.net) or a vanity/custom hostname.


I'm not sure a demandware.net hostname is allowed due to origin blocking. I think this has to be a vanity domain.

Also, could a proxy to commerce cloud work? Ie. https://<PWA Kit hostname>/mobify/proxy/ocapi/on/demandware.static/Sites-Site/-/-/internal/jscript/sfp/v1/sfp where /mobify/proxy/ocapi is set up to route requests to ecom?

I really don't know how the vanity urls work and how the production urls even look like. Our internal ODS systems tend to have demandware.net. So I said 'maybe' but if we have a definitive pattern on how these urls look like in production, we can change that comment

For active data in PWA Kit v3 (and for OCAPI requests on PWA Kit v2), we used to set up a 2nd proxy /mobify/proxy/ocapi that points to the ecom instance under *.commercecloud.salesforce.com.

Here's what a response for Active Data looks like on the PWA Kit demo env using the proxy

vcua-mobify · 2026-03-05T17:48:31Z

packages/template-retail-react-app/CHANGELOG.md

@@ -1,4 +1,5 @@
 ## v9.1.0-dev
+- [Feature] Add Salesforce Payments support in checkout


Nit: Let's update the changelog entry with a link to this PR

vcua-mobify · 2026-03-05T17:51:15Z

packages/template-retail-react-app/app/ssr.js

+    protocol: process.env.DEV_SERVER_PROTOCOL || 'http',
+
+    // SSL file path for HTTPS development
+    sslFilePath: process.env.DEV_SERVER_SSL_FILE_PATH,


Do these need to be added to the ssr.js templates in the pwa-kit-create-app generator>

We only added it to the local development template and not to the handlebar files. local host requires ssl and https for payments, else development and debugging is not possible. But something to discuss

vcua-mobify · 2026-03-05T17:53:17Z

packages/commerce-sdk-react/CHANGELOG.md

@@ -1,4 +1,5 @@
 ## v5.1.0-dev
+- Bump commerce-sdk-isomorphic to 5.1.0


Nit: Let's add he link for this PR to this changelog entry

vcua-mobify · 2026-03-05T17:54:39Z

packages/template-retail-react-app/app/utils/sf-payments-utils.js

@@ -0,0 +1,470 @@
+/*
+ * Copyright (c) 2025, salesforce.com, inc.


Nit: Let's update these to 2026

vcua-mobify · 2026-03-05T17:58:10Z

packages/template-retail-react-app/app/pages/checkout/payment-processing.jsx

+import {useToast} from '@salesforce/retail-react-app/app/hooks/use-toast'
+import {PAYMENT_GATEWAYS} from '@salesforce/retail-react-app/app/constants'
+
+// const ADYEN_SUCCESS_RESULT_CODES = [


We can clean this up I think

vcua-mobify · 2026-03-05T18:01:57Z

packages/template-retail-react-app/app/pages/checkout/partials/contact-info.jsx

 import {useCurrentBasket} from '@salesforce/retail-react-app/app/hooks/use-current-basket'
-import {AuthHelpers, useAuthHelper, useShopperBasketsMutation} from '@salesforce/commerce-sdk-react'
+import {isAbsoluteURL} from '@salesforce/retail-react-app/app/page-designer/utils'
+import {useAppOrigin} from '@salesforce/retail-react-app/app/hooks/use-app-origin'


Are these imports for isAbsoluteURL and useAppOrigin needed?

vmarta · 2026-03-05T18:12:05Z

packages/pwa-kit-create-app/assets/bootstrap/js/overrides/app/ssr.js.hbs

+                'google.com',
+                'www.google.com'


After the merge, as discussed in this comment from the previous PR, please update it to be more narrow scoped. Thanks.

Sure, we will need to verify it and run some E2E to make sure we capture the exact domains since we don't want to be in a situation where the feature breaks either because of CSP

vcua-mobify

Following a sync meet, the remaining comments will be addressed in a quick follow PR

sf-henry-semaganda

lgtm

rasbhat · 2026-03-05T22:52:33Z

This PR has been squash merged to develop in this PR here: #3725. Closing this PR .

alafemina and others added 30 commits October 20, 2025 10:08

@W-19990736 render salesforce payments paypal (#3415)

5c0ab4b

* render paypal * refactor shopper config checker

@W-19990746 Complete Paypal Payments on Sheet and Express (#3435)

ba5e3d4

* refactor shopper config checker * baskets v2 temp commit * complete paypal and code clean up * address comments * fix

W-20117176: Update Amount on Order Total Change

c85364a

W-20117176: Update Amount on Order Total Change

a8a24dd

W-20117176: Addressing comments

63873c1

W-20117176: Addressing comments

eb1c5f3

W-20117176: Addressing comments

fc194ff

W-20117176: Addressing comments

9e42340

W-20117176: Addressing comments

afaf9ca

W-20117176: Adding test cases

56d37a2

Merge pull request #3475 from SalesforceCommerceCloud/rvishwanathbhat…

040202c

…/sfp-update-amount-prevent-reinit @W-20117176 : Call updateAmount on Order Total change

W-19799923: Remove payment details on order confirmation page for new…

f7c856d

… SFP

W-19799923: Addressing comments, adding test

c611544

W-19443266: Handle Failure use-cases in the UI (#3534)

059bc69

* W-19443266: Handle Failure use-cases by calling Fail Order where necessary. Also refactor the client-secret retrieval since the response structure has changed.

W-19799923: Addressing comments, adding test cases

d753f95

W-19799923: Addressing comments

a5021f5

Merge pull request #3513 from SalesforceCommerceCloud/rvishwanathbhat…

fb8d354

…/order-confirmation-hide-sfp-payment-details @W-19799923: Remove payment details on order confirmation page for SFP orders

W-20394105: enable save payment method for future use for registered …

0285bf2

…users

W-20394105: enable save payment method for future use for registered …

9cba5c2

…users

W-20394105: enable save payment method for future use for registered …

7150ebc

…users

W-20394105: Address comments

0ff47b3

W-20394105: Addressing comments

3313420

W-20394105: Remove redundant code, refactoring

b8eb23c

W-20394105: Adding tests, increased test coverage

d5d40e0

W-20394105: Adding tests, increased test coverage

285a2e9

W-20394105: Addressing comments

743d9eb

W-20394105: lint fixes

522b19a

W-20394105: Adress comments

f7e94b9

rasbhat and others added 13 commits March 3, 2026 12:34

W-21411273, W-21434212: Fix for Stripe SPM cache issues, fixed failin…

f518460

…g tests

W-21411273, W-21434212: Fix for Stripe SPM cache issues, fixed failin…

d7e8965

…g tests

W-21411273, W-21434212: Addressing comments

37d81eb

Merge pull request #3707 from SalesforceCommerceCloud/rvishwanathbhat…

6b98416

…/fail-order-on-redirect W-21372336: Fail Order for redirect based payments

Merge pull request #3710 from SalesforceCommerceCloud/rvishwanathbhat…

0bcdba7

…/stripe-caching-for-display-spm-fix-tests W-21411273, W-21434212: Fix for Display SPMs at checkout due to caching issues and Fix for failing tests on feature branch

W-21436534: Merge from develop

764bf94

Merge pull request #3713 from SalesforceCommerceCloud/rvishwanathbhat…

37a7237

…/merge-changes-from-develop W-21436534: Merge from Develop to feature branch

W-21432256 Address code review comments (#3715)

6b81bc9

* W-21432256: address code review comments from PWA team

W-21432256: update lock file to point to public npm (#3717)

662b6c9

W-21324157: Zone ID updated to use paymentconfig zoneID

f07222d

Merge pull request #3718 from SalesforceCommerceCloud/rvishwanathbhat…

b2feeb7

…/payment-sheet-zone-id W-21324157: Zone ID updated to use paymentconfig zoneID in Payment Sheet

W-20911530: fixing failing unit test

4f45506

Merge pull request #3719 from SalesforceCommerceCloud/nayana.vishwa/W…

40e8d37

…-20911530-UT W-20911530: fixing failing unit test

rasbhat added 2 commits March 4, 2026 19:06

W-21354832: resolving merge conflicts

ddb8947

Made-with: Cursor

W-21354832: lint fix

c4181da

rasbhat changed the title ~~TEST PR, DO NOT MERGE~~ W-21432256: Salesforce Payments on PWA Feature Mar 5, 2026

rasbhat marked this pull request as ready for review March 5, 2026 04:35

rasbhat requested review from a team as code owners March 5, 2026 04:35

syadupathi-sf approved these changes Mar 5, 2026

View reviewed changes

vcua-mobify reviewed Mar 5, 2026

View reviewed changes

vmarta reviewed Mar 5, 2026

View reviewed changes

vcua-mobify approved these changes Mar 5, 2026

View reviewed changes

sf-henry-semaganda approved these changes Mar 5, 2026

View reviewed changes

vcua-mobify mentioned this pull request Mar 5, 2026

W-21432256: Salesforce Payments on PWA Feature #3725

Merged

12 tasks

rasbhat closed this Mar 5, 2026

		@@ -1,4 +1,5 @@
		## v9.1.0-dev
		- [Feature] Add Salesforce Payments support in checkout

		@@ -1,4 +1,5 @@
		## v5.1.0-dev
		- Bump commerce-sdk-isomorphic to 5.1.0

		@@ -0,0 +1,470 @@
		/*
		* Copyright (c) 2025, salesforce.com, inc.

Conversation

rasbhat commented Mar 5, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Types of Changes

Changes

How to Test-Drive This PR

Checklists

General

Accessibility Compliance

Localization

Uh oh!

cc-prodsec commented Mar 5, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Snyk checks have passed. No issues have been found so far.

Uh oh!

syadupathi-sf commented Mar 5, 2026

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

vcua-mobify left a comment

Choose a reason for hiding this comment

Uh oh!

sf-henry-semaganda left a comment

Choose a reason for hiding this comment

Uh oh!

rasbhat commented Mar 5, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

14 participants

rasbhat commented Mar 5, 2026 •

edited

Loading

cc-prodsec commented Mar 5, 2026 •

edited

Loading

rasbhat commented Mar 5, 2026 •

edited

Loading